<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="UTF-8" />
    <meta name="viewport" content="width=device-width, initial-scale=1.0" />
    <link rel="stylesheet" href="../../../yl/index.css" />
    <link rel="stylesheet" href="../../../style/index.css" />
    <title>线上举报信息</title>
    <style>
        .custom-tree-node {
            justify-content: flex-start;
        }

        #app {
            width: 100%;
            min-height: 100vh;
            position: relative;
        }
    </style>
</head>

<body>

    <div id="app" v-cloak>

        <div class="title">
            <div>
                举报名称&nbsp;&nbsp;<el-input v-model="page.value1" style="width: 200px; margin:0 10px;"
                    placeholder="请输入内容"></el-input>
                投诉人电话&nbsp;&nbsp;<el-input v-model="page.value2" style="width: 200px; margin:0 10px;"
                    placeholder="请输入投诉人电话"></el-input>
                <el-button icon="Search" style="margin: 0; margin-right: 10px;" @click="check">查询</el-button>
            </div>
        </div>
        <div class="body">

            <div class="right">
                <!-- <el-button class="zdtype" @click="handleOpenDialog">设置显示字段</el-button> -->
                <el-table id="table" border
                    :data-options="JSON.stringify({ 'TableName': 'PartyComplaints','primary_key':'complaint_id'})"
                    height="450" v-loading="loading" ref="multipleTable" tooltip-effect="dark" :data="Tabletdata"
                    @selection-change="handleSelectionChange">
                    <el-table-column min-width="180" v-for="column in columns" :key="column.COLUMN_NAME"
                        :prop="column.COLUMN_NAME" :label="column.COLUMN_COMMENT">
                        <template v-slot="{row}">
                            <div
                                v-if="row[column.COLUMN_NAME].includes('.png')||row[column.COLUMN_NAME].includes('.jpg')||row[column.COLUMN_NAME].includes('.jpeg')">
                                <el-image style="width: 100px; height: 100px" :src="photo + row[column.COLUMN_NAME]"
                                    fit="contain"></el-image>
                            </div>
                            <div v-else>
                                {{row[column.COLUMN_NAME]}}
                            </div>
                        </template>

                    </el-table-column>
                    <el-table-column label="操作" fixed="right" width="180">
                        <template #default="{row}">
                            <!-- <el-dropdown trigger="click" v-if="row.status == '提交'">
                                <el-button size="small">
                                    处理<el-icon class="el-icon--right"><arrow-down /></el-icon>
                                </el-button>
                                <template #dropdown>
                                    <el-dropdown-menu>
                                        <el-dropdown-item @click="handlecl(row)">
                                            已处理
                                        </el-dropdown-item>
                                        <el-dropdown-item @click="handleju(row)">
                                            拒绝
                                        </el-dropdown-item>
                                    </el-dropdown-menu>
                                </template>
                            </el-dropdown>
                            <el-button disabled v-else size="small" @click="handlefk(row)">
                                处理<el-icon class="el-icon--right"><arrow-down /></el-icon>
                            </el-button>
                            <el-button :disabled="row.status == '提交' || row.Feedback_Result != '' " style="margin-left: 10px;" size="small" type="danger" @click="handlefk(row)">
                                反馈
                            </el-button> -->

                            <el-button :disabled="row.action_type == '已处理'" size="small" :type="row.action_type == '已处理'?'info':'danger'" :loading="loading"
                                @click="handlecl(row)">
                                处理
                            </el-button>
                            <!-- <el-button :disabled="row.status == '提交'" size="small" type="danger"
                                :disabled="row.Receiver ==''" @click="handlefk(row)">
                                反馈
                            </el-button> -->

                            <el-button  size="small" type="danger" :loading="loading"
                                @click="handlexq(row)">
                                详情
                            </el-button>
                        </template>
                    </el-table-column>
                </el-table>
                <el-pagination style="margin-top: 1%;" :current-page="page.PageNumber" :page-size="page.RowAmount"
                    :page-sizes="[10, 100, 200, 300, 400]" layout="total, sizes, prev, pager, next, jumper"
                    :total="Total" @size-change="handleSizeChange" @current-change="handleCurrentChange" />
            </div>
        </div>

        <el-dialog :close-on-click-modal="false" @close="ClickCancel" v-model="showDialogDelete" width="550" class="custom-dialog">
            <template #header>
                <div class="dialog-header">
                    <span>请输入处理结果</span>
                </div>
            </template>
            <!-- <div style="display: flex; align-items: center;margin-bottom: 20px">
                处理类型：
                <el-select v-model.trim="action_type" placeholder="请选择处理类型" style="width: 80%">
                    <el-option v-for="(item,index) in Action_type" :key="index" :label="item.label"
                        :value="item.value"></el-option>
                </el-select>
            </div> -->
            <div style="display: flex; align-items: center;">
                处理结果：
                <el-input style="width: 80%" type="textarea" :autosize="{ minRows: 5}" placeholder="请输入处理结果"
                    v-model="Processing_Result"></el-input>
            </div>
            <div style="margin-top: 10px;">
                <yl-upload ref="ylUpload" drag @success="success" @remove="remove"
                    :limit="99" :file="fileList"></yl-upload>
            </div>
                
            
            <template #footer>
                <div class="dialog-footer">
                    <el-button @click="ClickCancel" class="cancel-btn">取消</el-button>
                    <el-button type="primary" @click="ClickConfirm" class="confirm-btn">确定</el-button>
                </div>
            </template>
        </el-dialog>

        <el-dialog :close-on-click-modal="false" v-model="showDialogDelete1" width="550" class="custom-dialog">
            <template #header>
                <div class="dialog-header">
                    <span>反馈</span>
                </div>
            </template>
            <div style="display: flex; align-items: center;margin-bottom: 20px">
                反馈打分：<el-rate v-model="Rating"></el-rate>
            </div>
            <div  style="display: flex; align-items: center;">
                反馈结果：
                <el-input style="width: 80%" type="textarea" :autosize="{ minRows: 5}" placeholder="请输入反馈结果"
                    v-model="Feedback_Result"></el-input>
            </div>
            <template #footer>
                <div class="dialog-footer">
                    <el-button @click="showDialogDelete1 = false" class="cancel-btn">取消</el-button>
                    <el-button type="primary" @click="deleteConfirm1" class="confirm-btn">确定</el-button>
                </div>
            </template>
        </el-dialog>
    </div>

    <script src="../../../utils/utils.js"></script>
    <script src="../../../utils/mixins.js"></script>
    <script src="../../../config/config.js"></script>
    <script src="../../../yl/vue.js"></script>
    <script src="../../../yl/index.js"></script>
    <script src="../../../yl/zh-cn.mjs"></script>
    <script src="../../../yl/index.iife.min.js"></script>
    <script src="../../../yl/jquery.min.js"></script>
    <script src="../../../utils/jquery.cookie.js"></script>
    <script src="../../../api/request.js"></script>
    <script src="./js/index.js"></script>
</body>

</html>